<style>
    .left_menu{
        float: left;
        background: #fff;
        width: 192px;
        line-height: 35px;
        box-sizing: border-box;
        border: 1px solid #e5e5e5;
    }
    .left_menu ul{padding:20px 0;min-height:660px}
    .left_menu ul li{line-height:40px;height:40px;color:#55555b;box-sizing:border-box;position:relative;cursor:pointer;padding:0 15px}
    .left_menu ul li a{color:#55555b}
    .left_menu ul li.menu-select a{color:#4381e6}
    .left_menu ul li.menu-select i{color:#4381e6}
    .left_menu ul li i{float:right;font-weight:700}
    .left_menu ul li.menu-select{color:#fff}
    .left_menu ul a{color:#fff}
    .left_menu ul li.menu-hover{background:#f8f8f8}

</style>
<div class="left_menu">
    <ul>
        {foreach $menu as $k => $menu_item}
        <a href="{:addon_url($menu_item['url'])}">
            <li class="{if $menu_item['is_select'] eq 1}menu-select ns-bg-color{else/}not-select {/if}">
                {if condition="$menu_item['is_select'] eq 1"}
                <span class="select-icon"><img src="{$menu_item['select_icon']}"/></span>
                {else/}
                <span class="not-icon"><img src="{$menu_item['icon']}"/></span>
                {/if}&nbsp;&nbsp;&nbsp;&nbsp;
                {$menu_item['title']}
            </li>
        </a>
        {/foreach}
    </ul>
</div>
<script type="text/javascript">
    $(".left_menu ul li.not-select").hover(function(){
        $(this).addClass('menu-hover');
    },function(){
        $(this).removeClass('menu-hover');
    });
</script>